<template>
	<view >
		<view class="nav-bar_1 flex-row">
	
			<text class="text_1">发起签约</text>
		</view>
		<view class="body flex-col" :style="{height:screenHeight+'px'}" >
			<view class="text-wrapper_1 flex-row">
				<text class="text_2">发起签约</text>
			</view>
			<view class="group_1 flex-row ">
				<view class="image-wrapper_1 flex-col" @click="other()" >
					<image class="image_3" referrerpolicy="no-referrer" src="/static/picture.jpg" />
				</view>
				<view   @click="other()" class="image-wrapper_2 flex-col" >
					<image class="image_4" referrerpolicy="no-referrer" src="/static/picture.jpg" />
				</view>
			</view>
			<view class="text-wrapper_2 flex-row ">
				<text class="text_3">使用图片</text>
				<text class="text_4" @click="other()">使用模板</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
        screenHeight: 0,//高度兼容适配
			}
		},
    onShow() {
      this.screenHeight = uni.getSystemInfoSync().windowHeight
    },
		methods: {
			other(){
				uni.navigateTo({
					url: '../other/other',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			picture(){
				uni.navigateTo({
					url: '../picture/picture',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			}

		}
	}
</script>

<style>
	.nav-bar_1 {
		width: 750rpx;
		height: 88rpx;
		background: url(https://lanhu.oss-cn-beijing.aliyuncs.com/psibzwvvmvsjq5izg8qlco4tghk1kpoy2857ec875-314b-4896-bfcb-e4359239e06c) 100% no-repeat;
		background-size: 100% 100%;
	}

	

	.text_1 {
		width: 146rpx;
		height: 34rpx;
		overflow-wrap: break-word;
		color: rgba(255, 255, 255, 1);
		font-size: 36rpx;
		font-family: Adobe Heiti Std R;
		text-align: left;
		white-space: nowrap;
		line-height: 34rpx;
		margin:30rpx auto 0  auto;
	}
	.body {
	  background-color: rgba(242, 242, 242, 1);
	  /* height: 1190rpx; */
	  width: 750rpx;
	  overflow-y: auto;
	}
	
	.text-wrapper_1 {
	  width: 118rpx;
	  height: 29rpx;
	  margin: 47rpx 0 0 62rpx;
	}
	
	.text_2 {
	  width: 118rpx;
	  height: 29rpx;
	  overflow-wrap: break-word;
	  color: rgba(27, 27, 27, 1);
	  font-size: 30rpx;
	  font-family: Adobe Heiti Std R;
	  text-align: left;
	  white-space: nowrap;
	  line-height: 69rpx;
	}
	
	.group_1 {
	  width: 630rpx;
	  height: 300rpx;
	  margin: 41rpx 0 0 60rpx;
	  justify-content: space-between;
	}
	
	.image-wrapper_1 {
	  background-color: rgba(255, 255, 255, 1);
	  border-radius: 10px;
	  height: 300rpx;
	  border: 1px solid rgba(200, 165, 86, 1);
	  width: 300rpx;
	}
	
	.image_3 {
	  width: 176rpx;
	  height: 162rpx;
	  margin: 69rpx 0 0 63rpx;
	}
	
	.image-wrapper_2 {
	  background-color: rgba(255, 255, 255, 1);
	  border-radius: 10px;
	  height: 300rpx;
	  border: 1px solid rgba(200, 165, 86, 1);
	  width: 300rpx;
	}
	
	.image_4 {
	  width: 176rpx;
	  height: 162rpx;
	  margin: 69rpx 0 0 62rpx;
	}
	
	.text-wrapper_2 {
	  width: 426rpx;
	  height: 23rpx;
	  margin: 29rpx 0 721rpx 163rpx;
	  justify-content: space-between
	}
	
	.text_3 {
	  width: 94rpx;
	  height: 23rpx;
	  overflow-wrap: break-word;
	  color: rgba(102, 102, 102, 1);
	  font-size: 24rpx;
	  font-family: Adobe Heiti Std R;
	  text-align: left;
	  white-space: nowrap;
	  line-height: 69rpx;
	}
	
	.text_4 {
	  width: 96rpx;
	  height: 23rpx;
	  overflow-wrap: break-word;
	  color: rgba(102, 102, 102, 1);
	  font-size: 24rpx;
	  font-family: Adobe Heiti Std R;
	  text-align: left;
	  white-space: nowrap;
	  line-height: 69rpx;
	  margin-left: 20rpx;
	}
	.flex-col {
	  display: flex;
	  flex-direction: column;
	}
	.flex-row {
	  display: flex;
	  flex-direction: row;
	}
</style>
